<template>
  <div class="box-card-content">
    <div class="sumAll">
      <div class="box-card-item">
        <div class="title">收款汇总</div>
        <div v-for="(item,key) in sum" :key="key" class="card-item-text">
          <div v-if="!item.showI">{{item.title}}：{{item.value}}{{item.unit}}</div>
          <el-popover
            v-else
            popper-class="mergs-detail1-sum-pop"
            placement="top"
            trigger="hover">
            <div class="pop-container">
              <div class="pop-des"  v-for="(i, k) in item.showI" :key="k">{{i.title}}：{{i.value}}{{i.unit}}</div>
            </div>
            <div class="mergs-detail-pop-title" slot="reference">{{item.title + '（i）'}}：{{item.value}}{{item.unit}}</div>
          </el-popover>
        </div>
      </div>
    </div>
    <div class="sumAll">
      <div class="box-card-item">
        <div class="title">退款汇总</div>
        <div v-for="(item,key) in refund" :key="key" class="card-item-text">
          {{item.title}}：{{item.value}}{{item.unit}}
        </div>
      </div>
    </div>
    <div class="sumAll" v-if="isShowSum">
      <div class="box-card-item">
        <div class="title">结算汇总</div>
        <div v-for="(item,key) in settle" :key="key" class="card-item-text">
          <div v-if="!item.showI">{{item.title}}：{{item.value}}{{item.unit}}</div>
          <el-popover
            popper-class="mergs-detail1-set-pop"
            placement="top"
            v-else
            trigger="hover">
            <div class="pop-container">
              <div class="pop-des" v-for="(i, k) in item.showI" :key="k">{{i.title}}：{{i.value}}{{i.unit}}</div>
            </div>
            <div class="mergs-detail-pop-title" slot="reference">{{item.title + '（i）'}}：{{item.value}}{{item.unit}}</div>
          </el-popover>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import mixin from '../mixins'
export default {
  mixins: [mixin],
  props:{
    czbGasDutyRecord: {
      type: Object
    },
    isShowSum: {
      type: Boolean
    }
  },
  data () {
    return {
      noVal: ['', null, undefined],
    }
  },
  watch: {
    czbGasDutyRecord (val) {
      this.setDataAll(val)
    }
  },
  methods: {
    // 设置汇总数据
    setDataAll (gasDuty) {
      let arr = ['sum','refund','settle']
      for (let i = 0; i < arr.length; i++) {
        this.setNumber(this[arr[i]],gasDuty) 
      }
    },
    // 将返回的总数据设置到每一项中
    setNumber (sum, all) {
      Object.keys(sum).forEach(key => {
        if (!this.noVal.includes(all[key])) {
          sum[key].value = all[key]
        }
        if (sum[key].showI) {
          Object.keys(sum[key].showI).forEach(item => {
            if (!this.noVal.includes(all[item])) {
              sum[key].showI[item].value = all[item]
            }
          })
        }
      })
    },
  }
}
</script>
